<!DOCTYPE html>
<style>
p { overflow: hidden; }
#test1 {overflow:hidden; display: inline-block;}
#test2 {overflow:hidden; display: block;}
</style>
<p> crbug.com/724453: There should be only an outline on the right-hand side and in the descent below the text.</p>
<p><a href="" id="test1"><span>Text</span></a></p>
<p> crbug.com/724453: There should be no outline below.</p>
<p><a href="" id="test2"><span>Text</span></a></p>
<script src="../../../resources/run-after-layout-and-paint.js"></script>
<script>
runAfterLayoutAndPaint(function() {
    test1.style.outline = 'solid 10px black';
    test2.style.outline = 'solid 10px black';
}, true);
</script>
